/* custom responsive grid layout */

.grid {
  display: grid;
  /*grid-template-rows: repeat(6, 1fr);*/
  grid-template-columns: repeat(12, 1fr);
  grid-gap: 2px;
}
.col-span-12, .col-span-11, .col-span-10, .col-span-9, .col-span-8, .col-span-7, .col-span-6, .col-span-5, .col-span-4, .col-span-3, .col-span-2, .col-span-1 {
  padding: 10px;
}

.col-span-12 {
  grid-column: span 12;
}
.col-span-11 {
  grid-column: span 11;
}
.col-span-10 {
  grid-column: span 10;
}
.col-span-9 {
  grid-column: span 9;
}
.col-span-8 {
  grid-column: span 8;
}
.col-span-7 {
  grid-column: span 7;
}
.col-span-6 {
  grid-column: span 6;
}
.col-span-5 {
  grid-column: span 5;
}
.col-span-4 {
  grid-column: span 4;
}
.col-span-3 {
  grid-column: span 3;
}
.col-span-2 {
  grid-column: span 2;
}
.col-span-1 {
  grid-column: span 1;
}
@media screen and (max-width: 575px) {
  .grid {
    display: block;
  }
}